<template>
  <el-dialog title="优惠剩余瓶数" :visible.sync="visible" width="600px" @closed="close">
    <div class="detail-content">
      <el-table :data="preferentialData" show-summary style="width: 100%; margin-bottom: 20px;" max-height="290">
        <el-table-column prop="goodsName" label="商品" />
        <el-table-column prop="preferentialCount" label="剩余瓶数" />
      </el-table>
    </div>
  </el-dialog>
</template>

<script>
  import { detailPreferential } from '@/api'
  export default {
    name: 'showPreferential',
    data() {
      return {
        visible: false,
        preferentialData: []
      }
    },
    methods: {
      open(temp, fromPlat) {
        return new Promise((resolve) => {
          this.resolve = resolve
          this.preferentialData = []
          this.visible = true
          this.csmId = temp.csmId
          this.csmAddressId = temp.csmAddressId
          this.fromPlat = fromPlat
          this.getData()
        })
      },
      async getData() {
        const params = {
          csmId: this.csmId,
          csmAddressId: this.csmAddressId,
          fromPlat: this.fromPlat
        }
        const res = await detailPreferential(params)
        this.preferentialData = res.data
      },
      close() {
        this.visible = false
        this.preferentialData = []
      }
    }
  }
</script>

<style lang="scss" scoped>
  .detail-content {
    max-height: 350px;
  }
</style>
